<template>
  <div>
    <el-row style="border-bottom:1px solid #d3d3d3;">
      <el-col :span="24">
        <el-col :span="1">
          <el-row>
            <el-image style="width: 20px; height: 20px;margin-top:10px" :src="require('@/imgs/项目.png')"></el-image>
          </el-row>
        </el-col>
        <el-col :span="8">
          <div style="line-height:30px;font-size:14px;margin-top:8px">项目名称： {{projectinfo.name}}</div>
        </el-col>
        <el-col :span="1" style="padding-top:10px">
          <el-row type="flex" justify="start">
            <el-tag v-if="projectinfo.projectstate==='5'" type="warning" effect="dark">
              {{projectinfo.dispprojectstate}}
            </el-tag>
            <el-tag v-else-if="projectinfo.projectstate==='4'" type="erro" effect="dark">
              {{projectinfo.dispprojectstate}}
            </el-tag>
            <el-tag v-else-if="projectinfo.projectstate === '2'" effect="dark">
              {{projectinfo.dispprojectstate}}
            </el-tag>
            <el-tag v-else-if="projectinfo.projectstate==='20'" type="success" effect="dark">
              {{projectinfo.dispprojectstate}}
            </el-tag>
            <el-tag v-else-if="projectinfo.projectstate==='21' || projectinfo.projectstate==='22' " type="info" effect="dark">
              {{projectinfo.dispprojectstate}}
            </el-tag>
            <el-tag v-else color="#333366" effect="dark">
              {{projectinfo.dispprojectstate}}
            </el-tag>
          </el-row>
        </el-col>
        <el-col :span="7" :offset="2">
          <el-row>
            <el-col :span="3" style="padding-top:0px">
              <el-row type="flex" justify="end">
                <el-image style="width: 20px; height: 20px;margin-top:10px;font-size:14px" :src="require('@/imgs/负责人.png')"></el-image>
              </el-row>
            </el-col>
            <el-col :span="10" type="flex" align='middle' style="padding-top:15px">
              <el-row style="font-size:14px" type="flex" justify="start">
                &nbsp;&nbsp;&nbsp;&nbsp;负责人：{{projectinfo.projectmanagername}}
              </el-row>
            </el-col>
            <el-col :span="11" type="flex" align='middle' style="padding-top:15px">
              <el-row style="line-height:15px;font-size:14px" type="flex" justify="start">
                &nbsp;&nbsp;&nbsp;&nbsp;项目类型：{{projectinfo.dispcategory}}
              </el-row>
            </el-col>

          </el-row>
        </el-col>
      </el-col>

      <!-- <el-col :span="4" style="height:50px">
        <el-divider direction="vertical" content-position="center"></el-divider>
      </el-col> -->

      <!-- <el-col :span="13" :offset="6">
        <el-row type="flex" justify="end">
          <el-button type="primary" size="small">快速新建</el-button>
          <el-button type="primary" size="small">存为模板</el-button>
          <el-button type="primary" size="small">暂停</el-button>
          <el-button type="primary" size="small">完成</el-button>
          <el-button type="primary" size="small">变更</el-button>
          <el-button size="small">删除</el-button>
          <el-button size="small">返回</el-button>
        </el-row>
      </el-col> -->
    </el-row>
  </div>
</template>

<script>
import { getAction, putAction, postAction, deleteAction } from '@tapui/utils/http'

// 项目负责人信息组件
export default {
  name: 'headOfThisProject',
  // mixins: [mixin_list],
  props: { projectinfo: {} },
  data() {
    return {
      projectid: ''
    }
  },

  methods: {
    // getProjectInfo() {
    //   debugger
    //   getAction('pm/project/load', { id: this.projectid }).then(result => {
    //     debugger
    //     this.projectinfo = result.result
    //   })
    // }
  },
  created() {
    // this.getProjectInfo()
    console.log(this.projectid)
  },
  watch: {
    projectinfo(val) {
      this.projectid = val.id
    }
  },
  mounted() {}
}
</script>

<style scoped>
.el-row {
  padding: 0px;
}
.el-tabs__nav-scroll {
  padding-bottom: 5px;
}
.app-container >>> .el-tabs__item {
  height: 30px;
}
.el-tabs__nav-scroll {
  padding-bottom: 5px;
}
</style>
